import React from 'react'

import {
  connect, //  用于连接数据映射和修改数据映射方法的连接函数 返回值是一个新的组件
} from 'react-redux'
import NavBar from '../component/NavBar'

import Panel from '../component/Panel'
import asymeth from '../store/asyncMethod/asyncmethod'
import '../assets/css/Barrier.css'

class Myapp extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      currentCount: 0, // 当前的题目
      selectType: ['', '', '', ''],
      score: 0,
      endTime: 15,
      timer: null,
      type: '',
    }
  }
  componentDidMount() {
    // this.props.getQuestionList()
    // console.log(this.props)
    this.getType()
    console.log('msggg', this.props)
  }
  render() {
    let stateInfo = this.props.location.state
    if (stateInfo.type === 'Special') {
    }
    return (
      <div>
        <NavBar params={this.props} name="生涯模式"></NavBar>
        <Panel stateMsg={stateInfo} info={this.props}></Panel>
      </div>
    )
  }

  getType = () => {
    if (this.props.location.state.info) {
      this.setState({
        type: 'career',
      })
    } else {
      this.setState({
        type: 'barrier',
      })
      this.props.getQuestionList()
    }
  }
}

// 将state银映射到props中
function mapStateToProps(state) {
  return {
    bareerQuestionList: state.bareerQuestionList,
    typeQuestionList: state.typeQuestionList,
  }
}

// 进啊给修改state数据的方法映射到props
function mapDispatchToProps(dispatch) {
  return {
    getQuestionList: async () => {
      let res = await asymeth.questionList()
      if (res.data.code === 200) {
        dispatch({ type: 'setQuetion', content: res.data.result })
        return
      }
      dispatch({ type: 'setQuetion', content: '题目获取失败' })
    },
  }
}

const Barrier = connect(mapStateToProps, mapDispatchToProps)(Myapp)

export default Barrier
